<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <title>*点餐</title>
    <meta name="keywords" content="DeathGhost,DeathGhost.cn,web前端设,移动WebApp开发"/>
    <meta name="description" content="DeathGhost.cn::H5 WEB前端设计开发!"/>
    <meta name="author" content="DeathGhost"/>
    <link  th:href="@{/style/style.css}" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" th:src="@{/js/public.js}"></script>
    <script type="text/javascript"  th:src="@{/js/jquery.js}"></script>
    <script type="text/javascript"  th:src="@{/js/jqpublic.js}"></script>
    <script type="text/javascript"  th:src="@{/js/cart.js}"></script>
    <script type="text/javascript"  th:src="@{/js/jquery.easyui.min.js}"></script>
    <script>
        $(function () {
            $('.title-list li').click(function () {
                var liindex = $('.title-list li').index(this);
                $(this).addClass('on').siblings().removeClass('on');
                $('.menutab-wrap div.menutab').eq(liindex).fadeIn(150).siblings('div.menutab').hide();
                var liWidth = $('.title-list li').width();
                $('.shopcontent .title-list p').stop(false, true).animate({'left': liindex * liWidth + 'px'}, 300);
            });

            $('.menutab-wrap .menutab li').hover(function () {
                $(this).css("border-color", "#ff6600");
                $(this).find('p > a').css('color', '#ff6600');
            }, function () {
                $(this).css("border-color", "#fafafa");
                $(this).find('p > a').css('color', '#666666');
            });
        });
        var mt = 0;
        window.onload = function () {
            var Topcart = document.getElementById("Topcart");
            var mt = Topcart.offsetTop;
            window.onscroll = function () {
                var t = document.documentElement.scrollTop || document.body.scrollTop;
                if (t > mt) {
                    Topcart.style.position = "fixed";
                    Topcart.style.margin = "";
                    Topcart.style.top = "200px";
                    Topcart.style.right = "191px";
                    Topcart.style.boxShadow = "0px 0px 20px 5px #cccccc";
                    Topcart.style.top = "0";
                    Topcart.style.border = "1px #636363 solid";
                } else {
                    Topcart.style.position = "static";
                    Topcart.style.boxShadow = "none";
                    Topcart.style.border = "";
                }
            }
        }
    </script>
</head>
<body>
<!--引用头部导航栏代码块-->
<div th:replace="~{commons/common::top}"></div>
<!--Start content-->
<section class="Shop-index">
    <article>
        <div class="shopinfor">
            <div class="title">
                <img th:src="${mealshop.meal_image}" class="shop-ico">
                <span>有间餐厅</span>
                <span>
                 <img src="images/star-on.png">
                 <img src="images/star-on.png">
                 <img src="images/star-on.png">
                 <img src="images/star-on.png">
                 <img src="images/star-off.png">
                </span>
                <span>4.8</span>
            </div>
            <div class="imginfor">
                <div class="shopimg">
                    <img th:src="${mealshop.meal_image}" id="showimg">
                </div>
                <div class="shoptext">
                    <p><span>菜名：</span>[[${mealshop.meal_name}]]</p>
                    <p><span>类别：</span>[[${mealshop.meal_classification}]]</p>
                    <p><span>描述：</span>[[${mealshop.meal_description}]]</p>
                    <p><span>原价：</span>
                        <del>[[${mealshop.meal_price}]]</del>
                    </p>
                    <p><span>现价：</span><span style="color: orangered">[[${mealshop.meal_price_now}]]</span></p>
                    <p><span>优惠：</span>[[${mealshop.meal_bargain_price}]]</p>
                    <p><span>卖出的数量：</span>[[${mealshop.meal_size}]]</p>
                    <div class="Button">
                        <a th:onclick="'mealCart('+${mealshop.meal_id}+')'" style="cursor:pointer" class="DCbutton">添加</a>
                    </div>
                    <div class="otherinfor">
                        <a th:if="${collect ne 'collect'}" th:onclick="'mealCollect('+${mealshop.meal_id}+')'" style="cursor:pointer" class="icoa"><img src="images/collect.png">收藏（[[${mealshop.meal_collect}]]）</a>
                        <a th:if="${collect eq 'collect'}" th:onclick="'mealCollectOver('+${mealshop.meal_id}+')'" style="cursor:pointer" class="icoa"><img src="images/collect.png">取消收藏（[[${mealshop.meal_collect}]]）</a>
                        <div class="bshare-custom"><a title="分享"
                                                      class="bshare-more bshare-more-icon more-style-addthis">分享</a>
                        </div>
                        <script type="text/javascript" charset="utf-8"
                                src="http://static.bshare.cn/b/buttonLite.js#style=-1&amp;uuid=&amp;pophcol=1&amp;lang=zh"></script>
                        <script type="text/javascript" charset="utf-8"
                                src="http://static.bshare.cn/b/bshareC0.js"></script>
                    </div>
                </div>
            </div>
            <div class="shopcontent">
                <div class="title2 cf">
                    <ul class="title-list fr cf ">
                        <li>累计评论（[[${cartList.size()}]]）</li>
                        <p><b></b></p>
                    </ul>
                </div>
                <div class="menutab-wrap">
                    <!--case2-->
                    <div class="menutab">
                        <div class="shopcomment"  th:each="cart:${cartList}">
                            <div class="C-content">
                                <q>[[${cart.title}]]</q>
                                <i>[[${cart.title_time}]]</i>
                            </div>
                            <div class="username">
                                [[${cart.user.username}]]
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </article>

    <aside>
        <div class="title" style="font-size: 15px;color: #18af6a">人气超高</div>
        <div style="border:1px solid #000000" class="C-list" th:each="meal:${mealList}">
            <a th:href="@{'/shop?meal_id='+${meal.meal_id}}" title="店铺名称"><img th:src="${meal.meal_image}" height="200" width="284"></a>
            <p><a href="shop_list.html">[[${meal.meal_name}]]</a></p>
            <p>
                <span>价格：<del style="color: #949494">[[${meal.meal_price}]]</del>&nbsp;&nbsp;&nbsp;&nbsp;[[${meal.meal_price_now}]]</span>
                <span style=" float:right">
                    <img src="images/star-on.png">
                    <img src="images/star-on.png">
                    <img src="images/star-on.png">
                    <img src="images/star-on.png">
                    <img src="images/star-off.png">
                    <span class="ALscore">4.8</span>
                   </span>
            </p>
        </div>
    </aside>
</section>
<!--End content-->
<!--引用底部栏代码块-->
<div th:replace="~{commons/common::last}"></div>

</body>
</html>
